<template>
	<div class="lend">
		<Header @search="search" @showDialog="showDialog('add')">
			<i class="el-icon-s-finance" style="margin: 0 10px;"></i>借出管理
		</Header>
		<Dialog ref="dialog" :options="options" @Save="saveLendList" @Update="updateLendList"></Dialog>
		<div class="el_table">
			<el-table :data="lendList" style="width: 100%"
				:header-cell-style="{background:'#394a64',color:'#ffffff'}">
				<el-table-column prop="id" hidden label="id" width="200" align="center"></el-table-column>
				<el-table-column prop="description" label="描述信息" width="200" align="center"></el-table-column>
				<el-table-column prop="lendTime" label="借出时间" width="200" align="center"></el-table-column>
				<el-table-column prop="productName" label="借出物品" width="200" align="center"></el-table-column>
				<el-table-column prop="returnTime" label="归还时间" width="200" align="center"></el-table-column>
				<el-table-column prop="userName" align="center" label="借物人"></el-table-column>
				<el-table-column align="center" label="编辑">
					<template slot-scope="scope">
						<el-button slot="reference" style="margin: 0 10px;" circle type="primary"
							@click="showDialog('update',scope.row,scope.row.id)">
							<i class="el-icon-edit"></i>
						</el-button>
						<el-popconfirm title="确定删除吗？" @confirm="handleDelete(scope.$index, scope.row)">
							<el-button slot="reference" circle type="danger"><i class="el-icon-delete"></i></el-button>
						</el-popconfirm>
					</template>
				</el-table-column>
			</el-table>
			<div class="el_pagination">
				<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
					:current-page="pageIndex" :page-sizes="[5, 10, 20, 30, 40, 50]" :page-size="pageSize"
					layout="total, sizes, prev, pager, next, jumper" :total="totalCount">
				</el-pagination>
			</div>
		</div>
	</div>
</template>

<script src="./_lend.js" lang="js"></script>
<style src="./_lend.less" lang="less" scoped></style>
